/**
 * 负责用户交互逻辑
 *
 * Created by lhtin on 2020-04-08T11:41:01.927Z.
 */
import React, { Component } from 'react'
import { View, Text } from 'react-native'
import {
  AppNavigator,
  WeBaseScene,
  FinancialInput,
  WeTouchable,
  Button
} from '@webank/trident'


export default class TransferOutScene extends WeBaseScene {
  static navigationOptions = ({ navigation: { state: { params = {} } } }) => ({
    headerTitle: '转出'
  })

  _onChange = (val) => {
    this.setSceneState({
      amount: val
    })
  }

  render () {
    const {
      balance
    } = this.params
    const {
      amount
    } = this.props
    return (
      <View>
        <FinancialInput
          color={'#000000'}
          topInfo={`银行卡余额${balance}元`}
          amount={amount}
          onChange={this._onChange}
        />
        <WeTouchable
          style={{
            marginTop: 10
          }}
          onPress={() => {

          }}
        >
          <View style={{
            paddingVertical: 20,
            paddingHorizontal: 15,
            flexDirection: 'row',
            alignItems: 'center',
            backgroundColor: '#FFFFFF'
          }}>
            <Text style={{
              width: 100
            }}>收款银行卡</Text>
            <Text>微众卡1234</Text>
          </View>
        </WeTouchable>

        <Button
          style={{
            marginVertical: 20,
            marginHorizontal: 20
          }}
          text={'确认转入'}
          disabled={!amount}
          onPress={() => {
            this.props.updateBalance(amount)
            AppNavigator.transfer.TransferOutResultScene({
              amount: amount
            })
          }}
        />
      </View>
    )
  }
}
